<template>
  <div id="basicInfo" >
    <el-form ref="form" :model="form" label-width="120px" style="margin-left: -20% ; margin-top: 5%">
      <el-form-item label="真实姓名：">
        <el-input v-model="form.name"></el-input>
      </el-form-item>
        <el-form-item label="学历：">
        <el-input v-model="form.education"></el-input>
      </el-form-item>
        <el-form-item label="年龄：">
        <el-input v-model="form.age"></el-input>
      </el-form-item>
        <el-form-item label="自我描述：">
        <el-input v-model="form.introduction"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="updateInfo">更新</el-button>
        <el-button>取消</el-button>
        </el-form-item>
    </el-form>
  </div>
</template>

<script>
  export default {
    name: 'basicInfo',
    data(){
    return {
        form: {
          name: '',
          age: '',
          education: '',
          introduction: ''
        }
      }
    },
    mounted:function(){
      this.getBasicInfo()
    },
    methods:{
      updateInfo() {
        this.$http({
          method: 'post',
          url: 'expert/update',
          data: this.form
        }).then((response)=>{
          if(response && response.data.status=='SUCCESS') {
             this.$message('修改成功');
             this.getBasicInfo();
          }else {

          }
        }).catch((err)=>{
        }) 
      },
      getBasicInfo(){
        this.$http({
          method: 'get',
          url: 'expert/get',
        }).then((response)=>{
          if(response && response.data.status=='SUCCESS') {
             this.form = response.data.object
          }
        }).catch((err)=>{
        }) 
      }
    }
  }
</script>

<style scoped>
  #basicInfo{
    width: 50%;
    margin:0 auto;
  }
</style>